<template>
    <header class="sticky top-0 z-30">
        <nav class="bg-white border-gray-200 border-b dark:bg-[#0d1117] dark:border-gray-800">
            <div class="max-w-screen-2xl flex flex-wrap items-center justify-between mx-auto p-4">

                <div class="flex items-center">
                    <!-- 移动端知识库目录图标 -->
                    <div class="inline-block lg:hidden mr-3">
                        <input type="checkbox" id="checkbox" v-model="isDrawerExpand">
                        <label for="checkbox" class="toggle">
                            <div class="bars" id="bar1"></div>
                            <div class="bars" id="bar2"></div>
                            <div class="bars" id="bar3"></div>
                        </label>
                    </div>

                    <!-- 博客 LOGO 、博客名称 -->
                    <a href="/" class="flex items-center">
                        <img :src="blogSettingsStore.blogSettings.logo" class="h-8 mr-3 rounded-full" alt="Weblog Logo" />
                        <span class="self-center text-2xl font-semibold whitespace-nowrap dark:text-gray-400">{{
                            blogSettingsStore.blogSettings.name }}</span>
                    </a>
                </div>


                <div class="flex items-center md:order-2">
                    <button type="button" data-collapse-toggle="navbar-search" aria-controls="navbar-search"
                        aria-expanded="false"
                        class="md:hidden text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5 mr-1">
                        <svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
                            viewBox="0 0 20 20">
                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
                        </svg>
                        <span class="sr-only">Search</span>
                    </button>

                    <!-- 白天黑夜切换 -->
                    <button @click="toggleDark()" class="ml-1 mr-4 vt-switch vt-switch-appearance" type="button"
                        role="switch" aria-label="切换深色模式" aria-checked="false" data-v-d401ce6f=""><span
                            class="vt-switch-check"><span class="vt-switch-icon"><!--[-->
                                <!-- 太阳图标 -->
                                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"
                                    viewBox="0 0 24 24" class="vt-switch-appearance-sun"
                                    :class="[isDark ? 'hidden' : 'block']">
                                    <path
                                        d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z">
                                    </path>
                                    <path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z">
                                    </path>
                                    <path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z">
                                    </path>
                                    <path
                                        d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z">
                                    </path>
                                    <path
                                        d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z">
                                    </path>
                                    <path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path>
                                    <path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path>
                                    <path
                                        d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z">
                                    </path>
                                    <path
                                        d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z">
                                    </path>
                                </svg>
                                <!-- 黑夜图标 -->
                                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"
                                    viewBox="0 0 24 24" class="vt-switch-appearance-moon"
                                    :class="[isDark ? 'block' : 'hidden']">
                                    <path
                                        d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z">
                                    </path>
                                </svg><!--]--></span></span></button>

                    <!-- 搜索框 -->
                    <button type="button" @click="clickSearchBtn" class="mr-2 hidden outline-none md:flex items-center text-sm leading-6 text-slate-400 rounded-md 
                        ring-1 ring-slate-900/10 shadow-sm py-1.5 pl-2 pr-3 hover:ring-slate-300 
                        dark:bg-slate-800 dark:hover:bg-slate-700 dark:hover:ring-slate-700">
                        <svg class="w-3.5 h-3.5 mr-2 text-gray-500 dark:text-gray-400" aria-hidden="true"
                            xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
                        </svg>
                        <span class="mr-3">搜索文章 ...</span>
                        <span class="px-2 py-[1px] flex-none text-xs border text-gray-400 rounded dark:border-gray-600">Ctrl
                            K</span>
                    </button>

                    <!-- 登录 -->
                    <div class="text-gray-900 ml-1 mr-1 hover:text-blue-700 dark:text-white" v-if="!isLogined"
                        @click="$router.push('/login')">登录</div>
                    <!-- 已经登录，展示用户头像 -->
                    <button id="dropdownDefaultButton" data-dropdown-toggle="dropdown" v-else
                        class="text-white ml-2 mr-2 md:mr-0 focus:ring-4 focus:ring-blue-300 font-medium rounded-full text-sm text-center inline-flex items-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
                        type="button">
                        <!-- 用户登录头像 -->
                        <img class="w-8 h-8 rounded-full" :src="blogSettingsStore.blogSettings.avatar" alt="user photo">
                    </button>

                    <!-- Dropdown menu -->
                    <div id="dropdown"
                        class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow dark:bg-gray-700">
                        <ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="dropdownDefaultButton">
                            <li>
                                <a @click="router.push('/admin/index')"
                                    class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
                                    <svg class="inline w-3 h-3 mb-[2px] mr-1 text-gray-700 dark:text-white"
                                        aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
                                        viewBox="0 0 20 20">
                                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
                                            stroke-width="2"
                                            d="M10 14v4m-4 1h8M1 10h18M2 1h16a1 1 0 0 1 1 1v11a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1Z" />
                                    </svg>
                                    进入后台
                                </a>
                            </li>
                            <li>
                                <a data-modal-target="popup-modal" data-modal-toggle="popup-modal"
                                    class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
                                    <svg class="inline w-3 h-3 mb-[2px] mr-1 text-gray-700 dark:text-white"
                                        aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
                                        viewBox="0 0 16 16">
                                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
                                            stroke-width="2"
                                            d="M4 8h11m0 0-4-4m4 4-4 4m-5 3H3a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h3" />
                                    </svg>
                                    退出登录
                                </a>
                            </li>
                        </ul>
                    </div>



                    <button data-collapse-toggle="navbar-search" type="button"
                        class="inline-flex outline-none items-center p-2 w-10 h-10 justify-center text-sm text-gray-500 rounded-lg md:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600"
                        aria-controls="navbar-search" aria-expanded="false">
                        <span class="sr-only">Open main menu</span>
                        <svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
                            viewBox="0 0 17 14">
                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="M1 1h15M1 7h15M1 13h15" />
                        </svg>
                    </button>
                </div>
                <div class="items-center justify-between hidden w-full md:flex md:w-auto md:order-1" id="navbar-search">

                    <!-- 移动端搜索框 -->
                    <button type="button" @click="clickSearchBtn" class="relative mt-3 flex w-full md:hidden items-center text-sm leading-6 text-slate-400 rounded-md
                         ring-1 ring-slate-900/10 shadow-sm py-1.5 pl-2 pr-3 hover:ring-slate-300 dark:bg-slate-800 
                         dark:highlight-white/5 dark:hover:bg-slate-700 dark:hover:ring-slate-700">
                        <svg class="w-3.5 h-3.5 mr-2 text-gray-500 dark:text-gray-400" aria-hidden="true"
                            xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
                        </svg>
                        <span class="mr-3 grow text-left">搜索文章 ...</span>
                        <span class="px-2 py-[1px] flex-none text-xs border text-gray-400 rounded dark:border-gray-600">Ctrl
                            K</span>
                    </button>

                    <ul class="flex flex-col p-4 md:p-0 mt-4 font-medium border border-gray-100 rounded-lg bg-gray-50 
                        md:flex-row md:space-x-8 md:mt-0 md:border-0 md:bg-white dark:bg-gray-100 md:dark:bg-[#0d1117] 
                        dark:border-gray-700">
                        <li>
                            <a @click="router.push('/')"
                                :class="[currPath == '/' ? 'text-green-400 md:border-b-2 md:border-green-400 dark:text-green-400 dark:md:border-green-400' : 'text-gray-900 dark:text-gray-400']"
                                class="block py-2 pl-3 pr-4 rounded md:rounded-none hover:bg-gray-100 md:hover:bg-transparent md:hover:text-green-400 md:bg-transparent md:p-0 dark:hover:bg-gray-700 md:dark:hover:bg-transparent"
                                aria-current="page">首页</a>
                        </li>
                        <li>
                            <a @click="router.push('/category/list')"
                                :class="[currPath.startsWith('/category') ? 'text-green-400 md:border-b-2 md:border-green-400 dark:text-green-400 dark:md:border-green-400' : 'text-gray-900 dark:text-gray-400']"
                                class="block py-2 pl-3 pr-4 rounded md:rounded-none hover:bg-gray-100 md:hover:bg-transparent md:hover:text-green-400 md:p-0 md:dark:hover:text-green-400  dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">分类</a>
                        </li>
                        <li>
                            <a @click="router.push('/tag/list')"
                                :class="[currPath.startsWith('/tag') ? 'text-green-400 md:border-b-2 md:border-green-400 dark:text-green-400 dark:md:border-green-400' : 'text-gray-900 dark:text-gray-400']"
                                class="block py-2 pl-3 pr-4 rounded md:rounded-none hover:bg-gray-100 md:hover:bg-transparent md:hover:text-green-400 md:p-0 md:dark:hover:text-green-400 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">标签</a>
                        </li>
                        <li>
                            <a @click="router.push('/archive/list')"
                                :class="[currPath == '/archive/list' ? 'text-green-400 md:border-b-2 md:border-green-400 dark:text-green-400 dark:md:border-green-400' : 'text-gray-900 dark:text-gray-400']"
                                class="block py-2 pl-3 pr-4 rounded md:rounded-none hover:bg-gray-100 md:hover:bg-transparent md:hover:text-green-400 md:p-0 md:dark:hover:text-green-400 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">归档</a>
                        </li>
                        <li>
                            <a @click="router.push('/wiki/list')"
                                :class="[currPath.startsWith('/wiki') ? 'text-green-400 md:border-b-2 md:border-green-400 dark:text-green-400 dark:md:border-green-400' : 'text-gray-900 dark:text-gray-400']"
                                class="block py-2 pl-3 pr-4 rounded md:rounded-none hover:bg-gray-100 md:hover:bg-transparent md:hover:text-green-400 md:p-0 md:dark:hover:text-green-400 dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">知识库</a>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>
    </header>

    <!-- 退出登录 -->
    <div id="popup-modal" tabindex="-1"
        class="fixed top-0 left-0 right-0 z-50 hidden p-4 overflow-x-hidden overflow-y-auto md:inset-0 h-[calc(100%-1rem)] max-h-full">
        <div class="relative w-full max-w-md max-h-full">
            <div class="relative bg-white rounded-lg shadow dark:bg-gray-700">
                <button type="button"
                    class="absolute top-3 right-2.5 text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ml-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white"
                    data-modal-hide="popup-modal">
                    <svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
                        viewBox="0 0 14 14">
                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                            d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
                    </svg>
                    <span class="sr-only">Close modal</span>
                </button>
                <div class="p-6 text-center">
                    <svg class="mx-auto mb-4 text-gray-400 w-12 h-12 dark:text-gray-200" aria-hidden="true"
                        xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                            d="M10 11V6m0 8h.01M19 10a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
                    </svg>
                    <h3 class="mb-5 text-lg font-normal text-gray-500 dark:text-gray-400">是否确定退出登录?
                    </h3>
                    <button @click="logout" data-modal-hide="popup-modal" type="button"
                        class="text-white bg-red-600 hover:bg-red-800 focus:ring-4 focus:outline-none focus:ring-red-300 dark:focus:ring-red-800 font-medium rounded-lg text-sm inline-flex items-center px-5 py-2.5 text-center mr-2">
                        确定
                    </button>
                    <button data-modal-hide="popup-modal" type="button"
                        class="text-gray-500 bg-white hover:bg-gray-100 focus:ring-4 focus:outline-none focus:ring-gray-200 rounded-lg border border-gray-200 text-sm font-medium px-5 py-2.5 hover:text-gray-900 focus:z-10 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-500 dark:hover:text-white dark:hover:bg-gray-600 dark:focus:ring-gray-600">
                        取消</button>
                </div>
            </div>
        </div>
    </div>

    <!-- 站内搜索 -->
    <div id="search-modal" tabindex="-1" aria-hidden="true"
        class="hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
        <div class="relative p-4 w-full max-w-2xl max-h-full">
            <!-- Modal content -->
            <div class="relative bg-white rounded-lg shadow dark:bg-gray-700">
                <!-- Modal header -->
                <div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600">

                    <!-- 搜索框 -->
                    <form class="w-full mr-2">
                        <label for="search"
                            class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
                        <div class="relative">
                            <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
                                <div v-if="searchLoading" role="status">
                                    <svg aria-hidden="true"
                                        class="w-4 h-4 text-gray-200 animate-spin dark:text-gray-600 fill-sky-600"
                                        viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg">
                                        <path
                                            d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
                                            fill="currentColor" />
                                        <path
                                            d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"
                                            fill="currentFill" />
                                    </svg>
                                    <span class="sr-only">Loading...</span>
                                </div>

                                <svg v-else class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
                                    xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
                                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
                                        stroke-width="2" d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
                                </svg>
                            </div>
                            <input type="search" id="search" ref="searchInputRef" v-model="searchWord"
                                class="block w-full p-4 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-sky-500 focus:border-sky-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-sky-500 dark:focus:border-sky-500"
                                placeholder="请输入关键词搜索..." required>
                        </div>
                    </form>

                    <!-- 关闭 Modal -->
                    <button type="button" @click="searchModal.hide()"
                        class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white">
                        <svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
                            viewBox="0 0 14 14">
                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
                        </svg>
                        <span class="sr-only">Close modal</span>
                    </button>
                </div>
                <!-- Modal body -->
                <div class="p-4 md:p-5 space-y-4">
                    <div v-if="searchArticles && searchArticles.length > 0">
                        <p class="text-base leading-relaxed text-gray-500 dark:text-gray-400">
                            共搜索到 {{ total }} 篇相关文章
                        </p>
                        <ol class="mt-3 divide-y divider-gray-200 dark:divide-gray-600">
                            <li v-for="(article, index) in searchArticles" :key="index">
                                <a @click="jumpToArticleDetailPage(article.id)" class="items-center cursor-pointer block p-3 sm:flex hover:bg-gray-100 hover:rounded-lg 
                                    dark:hover:bg-gray-600">
                                    <img class="w-24 h-full mb-3 mr-3 rounded-lg sm:mb-0" :src="article.cover">
                                    <div class="text-gray-600 dark:text-gray-400">
                                        <h2 class="text-base font-normal text-gray-900 dark:text-white"
                                            v-html="article.title"></h2>
                                        <span
                                            class="inline-flex items-center text-xs font-normal text-gray-500 dark:text-gray-400">
                                            <svg class="inline w-2.5 h-2.5 mr-2 text-gray-400" aria-hidden="true"
                                                xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
                                                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
                                                    stroke-width="2"
                                                    d="M5 1v3m5-3v3m5-3v3M1 7h18M5 11h10M2 3h16a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1Z">
                                                </path>
                                            </svg> {{ article.createDate }}</span>
                                    </div>
                                </a>
                            </li>
                        </ol>

                        <!-- 分页 -->
                        <div class="flex mt-7">
                            <a v-if="current > 1" @click="prePage" class="flex items-center justify-center px-3 h-8 me-3 text-xs font-medium text-gray-500 border 
                                border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-100 hover:text-gray-700 
                                dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">
                                <svg class="w-3 h-3 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                    fill="none" viewBox="0 0 14 10">
                                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
                                        stroke-width="2" d="M13 5H1m0 0 4 4M1 5l4-4" />
                                </svg>
                            </a>

                            <a v-if="current < pages" @click="nextPage" class="flex ml-auto items-center justify-center px-3 h-8 text-xs font-medium text-gray-500 
                                border border-gray-300 rounded-lg hover:bg-gray-100 hover:text-gray-700 dark:border-gray-600 
                             dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">
                                <svg class="w-3 h-3 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                                    fill="none" viewBox="0 0 14 10">
                                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
                                        stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9" />
                                </svg>
                            </a>
                        </div>
                    </div>
                    <!-- 未搜索到结果提示 -->
                    <div v-else class="flex items-center justify-center flex-col mb-10">
                        <svg  class="w-50 h-50" height="200" node-id="1" sillyvg="true" template-height="1024" template-width="1024"
                                version="1.1" viewBox="0 0 1024 1024" width="1024" xmlns="http://www.w3.org/2000/svg"
                                xmlns:xlink="http://www.w3.org/1999/xlink">
                                <defs node-id="153">
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-1" node-id="5"
                                        spreadMethod="pad" x1="0.5" x2="0.5" y1="1" y2="-0.41476682">
                                        <stop offset="0" stop-color="#ffdc4d" stop-opacity="0" />
                                        <stop offset="1" stop-color="#f4b538" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-2" node-id="8"
                                        spreadMethod="pad" x1="0.5" x2="0.5" y1="1" y2="-0.41476682">
                                        <stop offset="0" stop-color="#ffdc4d" stop-opacity="0" />
                                        <stop offset="1" stop-color="#f4b538" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-3" node-id="11"
                                        spreadMethod="pad" x1="0.89443105" x2="0" y1="0.30021656" y2="1.1068289">
                                        <stop offset="0" stop-color="#f1bc01" />
                                        <stop offset="1" stop-color="#ffdc4d" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-4" node-id="14"
                                        spreadMethod="pad" x1="-0.14764221" x2="1.0993861" y1="0.66171855" y2="0.5">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-5" node-id="17"
                                        spreadMethod="pad" x1="0.89443105" x2="0" y1="0.4461855" y2="0.66345793">
                                        <stop offset="0" stop-color="#f1bc01" />
                                        <stop offset="1" stop-color="#ffdc4d" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-6" node-id="20"
                                        spreadMethod="pad" x1="-0.14764221" x2="1.0993861" y1="0.6617477" y2="0.5">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-7" node-id="23"
                                        spreadMethod="pad" x1="0.89443105" x2="0" y1="0.4462212" y2="0.6633495">
                                        <stop offset="0" stop-color="#f1bc01" />
                                        <stop offset="1" stop-color="#ffdc4d" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-8" node-id="26"
                                        spreadMethod="pad" x1="0.89443105" x2="0" y1="0.48189855" y2="0.554982">
                                        <stop offset="0" stop-color="#f1bc01" />
                                        <stop offset="1" stop-color="#ffdc4d" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-9" node-id="29"
                                        spreadMethod="pad" x1="-0.52288675" x2="0.66610736" y1="0.5116955" y2="0.4803846">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-10" node-id="32"
                                        spreadMethod="pad" x1="0" x2="1.3517264" y1="0.5" y2="0.5">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-11" node-id="35"
                                        spreadMethod="pad" x1="0" x2="1.3517264" y1="0.5" y2="0.5">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-12" node-id="38"
                                        spreadMethod="pad" x1="0" x2="0.74496204" y1="0.5" y2="0.52038217">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-13" node-id="41"
                                        spreadMethod="pad" x1="0.36901027" x2="0.5991385" y1="0.2637945" y2="0.84523773">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-14" node-id="44"
                                        spreadMethod="pad" x1="-0.41948968" x2="0.5911355" y1="0.5689796" y2="0.48266125">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-15" node-id="47"
                                        spreadMethod="pad" x1="0" x2="1.2624928" y1="1" y2="1">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f1bc01" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-16" node-id="50"
                                        spreadMethod="pad" x1="0.86275023" x2="0" y1="-0.028050492" y2="-0.028050492">
                                        <stop offset="0" stop-color="#1d181c" />
                                        <stop offset="0.3" stop-color="#2c2422" />
                                        <stop offset="0.5" stop-color="#42352c" />
                                        <stop offset="0.7" stop-color="#57352c" />
                                        <stop offset="1" stop-color="#923629" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-17" node-id="56"
                                        spreadMethod="pad" x1="0.5" x2="0.5" y1="0.12924309" y2="1">
                                        <stop offset="0" stop-color="#ffcda5" />
                                        <stop offset="1" stop-color="#ffe8d1" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-18" node-id="59"
                                        spreadMethod="pad" x1="0.4141964" x2="0.93228686" y1="0" y2="1">
                                        <stop offset="0" stop-color="#fff2df" />
                                        <stop offset="1" stop-color="#fee0bc" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-19" node-id="62"
                                        spreadMethod="pad" x1="0.358055" x2="0.83405435" y1="1.1840205" y2="-0.1022284">
                                        <stop offset="0" stop-color="#41b093" />
                                        <stop offset="1" stop-color="#184657" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-20" node-id="65"
                                        spreadMethod="pad" x1="0.3237294" x2="0.71038276" y1="0.79376185" y2="0.5">
                                        <stop offset="0" stop-color="#41b093" />
                                        <stop offset="1" stop-color="#184657" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-21" node-id="68"
                                        spreadMethod="pad" x1="0.3358208" x2="0.88638043" y1="1.1840205" y2="-0.1022284">
                                        <stop offset="0" stop-color="#41b093" />
                                        <stop offset="1" stop-color="#184657" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-22" node-id="71"
                                        spreadMethod="pad" x1="0.4525116" x2="0.9923633" y1="0.9971597" y2="0.9971597">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f4b538" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-23" node-id="74"
                                        spreadMethod="pad" x1="0.4525116" x2="0.9923633" y1="0.9971597" y2="0.9971597">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f4b538" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-24" node-id="77"
                                        spreadMethod="pad" x1="0.4525116" x2="0.9923633" y1="0.9971597" y2="0.9971597">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f4b538" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-25" node-id="80"
                                        spreadMethod="pad" x1="0.4525116" x2="0.9923633" y1="0.9971597" y2="0.9971597">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f4b538" />
                                    </linearGradient>
                                    <linearGradient gradientUnits="objectBoundingBox" id="linearGradient-26" node-id="83"
                                        spreadMethod="pad" x1="0.4525116" x2="0.9923633" y1="0.9971597" y2="0.9971597">
                                        <stop offset="0" stop-color="#ffdc4d" />
                                        <stop offset="1" stop-color="#f4b538" />
                                    </linearGradient>
                                </defs>
                                <path d="M 0.00 0.00 L 1024.00 0.00 L 1024.00 1024.00 L 0.00 1024.00 Z" fill="none" id="矩形"
                                    node-id="87" stroke="none" target-height="1024" target-width="1024" target-x="0"
                                    target-y="0" />
                                <g node-id="316">
                                    <path
                                        d="M 47.54 659.54 C 39.48 624.80 -12.96 398.53 135.32 367.41 C 283.60 336.30 371.20 372.54 436.35 309.19 C 501.51 245.84 517.75 256.23 571.27 260.42 C 624.78 264.61 686.81 218.89 707.65 205.15 C 728.49 191.41 916.66 103.04 964.77 367.41 C 972.37 481.71 978.69 605.72 925.46 652.69 C 872.23 699.66 926.43 741.84 964.77 746.52 C 1003.11 751.21 946.85 831.47 858.30 866.51 C 799.42 892.92 418.60 968.64 190.54 890.80 C 80.42 843.65 55.59 694.29 47.54 659.54 Z"
                                        fill="#f1bc01" fill-opacity="0.05" fill-rule="evenodd" group-id="1" id="路径-58"
                                        node-id="88" stroke="none" target-height="865.5997" target-width="1016.07056"
                                        target-x="-12.964274" target-y="103.03797" />
                                </g>
                                <path
                                    d="M 908.00 227.38 C 908.00 240.50 895.48 251.00 879.66 251.00 L 792.00 251.00 C 776.18 249.95 763.00 239.97 763.00 226.32 C 763.00 217.40 768.93 209.53 777.50 205.32 C 776.84 203.75 776.18 202.18 776.18 200.60 C 776.18 191.68 784.75 183.80 795.95 183.80 C 800.57 183.80 804.52 185.38 807.82 187.47 C 815.73 175.40 830.23 167.00 847.36 167.00 C 871.09 167.00 890.20 183.28 890.20 203.22 L 890.20 205.32 C 900.75 209.00 908.00 217.40 908.00 227.38 Z"
                                    fill="url(#linearGradient-1)" fill-rule="evenodd" id="云" node-id="89" stroke="none"
                                    target-height="84" target-width="145" target-x="763" target-y="167" />
                                <path
                                    d="M 248.50 301.00 C 270.80 301.00 289.79 315.17 296.95 335.00 L 328.50 335.00 C 338.16 335.00 346.00 342.84 346.00 352.50 L 346.00 388.50 C 346.00 398.16 338.16 406.00 328.50 406.00 L 169.50 406.00 C 159.84 406.00 152.00 398.16 152.00 388.50 L 152.00 378.72 C 148.19 372.55 146.00 365.28 146.00 357.50 C 146.00 335.13 164.13 317.00 186.50 317.00 C 193.86 317.00 200.76 318.96 206.71 322.40 C 216.06 309.44 231.30 301.00 248.50 301.00 Z"
                                    fill="url(#linearGradient-2)" fill-rule="evenodd" id="云" node-id="90" stroke="none"
                                    target-height="105" target-width="200" target-x="146" target-y="301" />
                                <path
                                    d="M 900.00 405.98 L 885.56 407.41 L 871.86 408.24 L 858.85 408.50 L 846.50 408.21 L 834.77 407.40 L 823.64 406.10 L 813.06 404.33 L 803.01 402.11 L 793.45 399.45 L 784.37 396.37 L 775.73 392.87 L 767.50 388.96 L 759.68 384.65 L 752.23 379.92 L 745.14 374.78 L 741.62 371.63 L 738.53 368.34 L 735.87 364.91 L 733.59 361.32 L 731.04 356.24 L 729.14 351.11 L 727.86 345.91 L 727.15 340.61 L 727.02 335.48 L 727.43 330.52 L 728.39 325.63 L 729.84 321.17 L 731.76 317.09 L 733.56 314.21 L 735.58 311.69 L 737.83 309.49 L 740.31 307.60 L 743.02 306.07 L 745.94 304.96 L 749.11 304.27 L 752.57 304.00 L 757.80 304.29 L 762.64 305.10 L 767.13 306.41 L 771.32 308.19 L 775.28 310.49 L 778.93 313.22 L 782.30 316.43 L 785.39 320.13 L 788.05 324.10 L 790.42 328.52 L 792.49 333.41 L 794.25 338.84 L 795.55 344.27 L 796.51 350.14 L 797.11 356.48 L 797.33 363.34 L 797.09 370.58 L 796.39 377.96 L 795.22 385.47 L 793.63 392.92 L 791.63 400.30 L 789.22 407.62 L 786.42 414.80 L 783.28 421.70 L 779.80 428.36 L 775.93 434.79 L 771.81 440.76 L 767.42 446.29 L 762.65 451.47 L 757.70 456.03 L 752.57 460.00"
                                    fill="none" group-id="2" id="路径-20" node-id="92" stroke="url(#linearGradient-3)"
                                    stroke-linecap="round" stroke-width="2" target-height="156" target-width="172.98413"
                                    target-x="727.01587" target-y="304" />
                                <path
                                    d="M 747.49 440.42 L 743.92 437.96 L 740.57 436.34 L 737.40 435.44 L 734.34 435.17 L 731.33 435.51 L 728.32 436.48 L 725.25 438.13 L 722.07 440.58 L 718.77 443.96 L 715.32 448.45 L 713.51 451.57 L 711.87 454.88 L 708.57 461.40 L 706.64 464.36 L 704.37 466.88 L 702.63 468.27 L 700.59 469.38 L 698.21 470.21 L 706.79 470.73 L 714.18 470.66 L 720.53 470.09 L 725.95 469.09 L 730.56 467.72 L 734.46 466.02 L 737.75 464.02 L 740.50 461.74 L 742.76 459.16 L 744.59 456.26 L 746.00 452.99 L 746.97 449.31 L 747.48 445.15 L 747.49 440.42 Z"
                                    fill="url(#linearGradient-4)" fill-rule="evenodd" group-id="2,9" id="路径-18" node-id="93"
                                    stroke="none" target-height="35.55719" target-width="49.278625" target-x="698.20776"
                                    target-y="435.1717" />
                                <path
                                    d="M 757.23 428.00 L 756.37 430.32 L 754.64 433.06 L 751.79 436.32 L 747.48 440.22 L 741.32 444.86 L 732.88 450.37 L 721.69 456.86"
                                    fill="none" group-id="2,10" id="路径-19" node-id="94" stroke="url(#linearGradient-5)"
                                    stroke-linecap="round" stroke-width="2" target-height="28.858246" target-width="35.535767"
                                    target-x="721.6943" target-y="427.99997" />
                                <path
                                    d="M 204.77 695.60 L 202.01 692.25 L 199.24 689.77 L 196.44 688.02 L 193.57 686.92 L 190.59 686.42 L 187.43 686.52 L 184.02 687.26 L 180.30 688.74 L 176.19 691.08 L 171.64 694.44 L 169.04 696.94 L 166.55 699.67 L 161.59 705.03 L 158.91 707.34 L 156.04 709.14 L 153.98 709.99 L 151.72 710.50 L 149.20 710.64 L 157.30 713.50 L 164.43 715.48 L 170.69 716.68 L 176.17 717.22 L 180.98 717.17 L 185.20 716.61 L 188.91 715.60 L 192.18 714.16 L 195.07 712.31 L 197.63 710.02 L 199.88 707.27 L 201.82 704.00 L 203.46 700.14 L 204.77 695.60 Z"
                                    fill="url(#linearGradient-6)" fill-rule="evenodd" group-id="2,11" id="路径-18备份" node-id="95"
                                    stroke="none" target-height="30.795044" target-width="55.572372" target-x="149.1968"
                                    target-y="686.42236" />
                                <path
                                    d="M 219.11 687.45 L 217.64 689.44 L 215.23 691.60 L 211.59 693.94 L 206.37 696.50 L 199.17 699.26 L 189.54 702.23 L 177.00 705.38"
                                    fill="none" group-id="2,12" id="路径-19备份" node-id="96" stroke="url(#linearGradient-7)"
                                    stroke-linecap="round" stroke-width="2" target-height="17.935547" target-width="42.105667"
                                    target-x="177" target-y="687.4468" />
                                <path
                                    d="M 233.00 646.00 L 221.47 650.96 L 210.86 655.04 L 201.10 658.32 L 192.12 660.87 L 183.88 662.75 L 176.32 664.03 L 169.38 664.77 L 163.00 665.00"
                                    fill="none" group-id="2" id="路径-22" node-id="97" stroke="url(#linearGradient-8)"
                                stroke-linecap="round" stroke-width="2" target-height="19" target-width="70" target-x="163"
                                target-y="646" />
                            <path d="M 448.00 859.11 L 572.74 834.00 L 788.00 846.19 L 670.53 886.00 Z"
                                fill="url(#linearGradient-9)" fill-rule="evenodd" group-id="3" id="路径-68" node-id="99"
                                stroke="none" target-height="52" target-width="340" target-x="448" target-y="834" />
                            <path d="M 574.00 676.38 L 574.00 833.64 L 713.00 842.00 L 712.75 665.00 Z"
                                fill="url(#linearGradient-10)" fill-rule="evenodd" group-id="3" id="路径-69" node-id="100"
                                stroke="none" target-height="177" target-width="139" target-x="574" target-y="665" />
                            <path d="M 448.00 643.00 L 448.00 859.00 L 574.00 832.93 L 574.00 676.50 Z"
                                fill="url(#linearGradient-11)" fill-rule="evenodd" group-id="3" id="路径-70" node-id="101"
                                stroke="none" target-height="216" target-width="126" target-x="448" target-y="643" />
                            <path d="M 448.00 643.76 L 669.32 622.00 L 788.00 659.92 L 573.66 677.00 Z"
                                fill="url(#linearGradient-12)" fill-rule="evenodd" group-id="3" id="路径-71" node-id="102"
                                stroke="none" target-height="55" target-width="340" target-x="448" target-y="622" />
                            <path d="M 672.87 623.00 L 670.00 888.00 L 788.00 846.54 L 788.00 657.76 Z"
                                fill="url(#linearGradient-13)" fill-rule="evenodd" group-id="3" id="路径-72" node-id="103"
                                stroke="none" target-height="265" target-width="118" target-x="670" target-y="623" />
                            <path d="M 449.00 643.00 L 462.98 589.19 L 694.00 552.00 L 673.34 623.34 Z"
                                fill="url(#linearGradient-14)" fill-rule="evenodd" group-id="3" id="路径-73" node-id="104"
                                stroke="none" target-height="91" target-width="245" target-x="449" target-y="552" />
                            <path d="M 448.43 860.00 L 425.00 885.79 L 636.80 924.00 L 671.00 885.79 Z"
                                fill="url(#linearGradient-15)" fill-rule="evenodd" group-id="3" id="路径-74" node-id="105"
                                stroke="none" target-height="64" target-width="246" target-x="425" target-y="860" />
                            <path
                                d="M 285.00 904.50 L 285.25 906.42 L 285.95 908.33 L 287.16 910.26 L 288.98 912.24 L 291.74 914.47 L 295.37 916.72 L 300.05 918.97 L 304.87 920.84 L 310.47 922.61 L 316.93 924.27 L 323.44 925.62 L 330.57 926.79 L 338.35 927.75 L 346.14 928.43 L 354.35 928.85 L 363.00 929.00 L 371.65 928.85 L 379.86 928.43 L 387.65 927.75 L 395.43 926.79 L 402.56 925.62 L 409.07 924.27 L 415.53 922.61 L 421.13 920.84 L 425.95 918.97 L 430.63 916.72 L 434.26 914.47 L 437.02 912.24 L 438.84 910.26 L 440.05 908.33 L 440.75 906.42 L 441.00 904.50 L 440.75 902.58 L 440.05 900.67 L 438.84 898.74 L 437.02 896.76 L 434.26 894.53 L 430.63 892.28 L 425.95 890.03 L 421.13 888.16 L 415.53 886.39 L 409.07 884.73 L 402.56 883.38 L 395.43 882.21 L 387.65 881.25 L 379.86 880.57 L 371.65 880.15 L 363.00 880.00 L 354.35 880.15 L 346.14 880.57 L 338.35 881.25 L 330.57 882.21 L 323.44 883.38 L 316.93 884.73 L 310.47 886.39 L 304.87 888.16 L 300.05 890.03 L 295.37 892.28 L 291.74 894.53 L 288.98 896.76 L 287.16 898.74 L 285.95 900.67 L 285.25 902.58 L 285.00 904.50 Z"
                                fill="#f1bc01" fill-opacity="0.3" fill-rule="evenodd" group-id="4,13" id="椭圆形" node-id="107"
                                stroke="none" target-height="49" target-width="156" target-x="285" target-y="880" />
                            <path
                                d="M 378.03 889.54 L 379.10 896.46 L 382.29 896.74 L 385.70 897.44 L 389.38 898.60 L 393.35 900.26 L 394.85 901.29 L 395.72 902.04 L 396.35 902.82 L 396.67 903.51 L 396.91 905.10 L 396.68 905.41 L 395.44 905.74 L 391.83 905.98 L 383.86 905.88 L 368.91 905.10 L 368.91 887.00 L 378.03 889.54 Z"
                                fill="#333333" fill-rule="nonzero" group-id="4" id="路径-52" node-id="108" stroke="none"
                                target-height="18.981384" target-width="27.999603" target-x="368.91052" target-y="887" />
                            <path
                                d="M 337.03 889.54 L 338.10 896.46 L 341.29 896.74 L 344.70 897.44 L 348.38 898.60 L 352.35 900.26 L 353.85 901.29 L 354.72 902.04 L 355.35 902.82 L 355.67 903.51 L 355.91 905.10 L 355.68 905.41 L 354.44 905.74 L 350.83 905.98 L 342.86 905.88 L 327.91 905.10 L 327.91 887.00 L 337.03 889.54 Z"
                                fill="#333333" fill-rule="nonzero" group-id="4" id="路径-52备份-2" node-id="109" stroke="none"
                                target-height="18.981384" target-width="27.999603" target-x="327.91052" target-y="887" />
                            <path
                                d="M 346.63 746.00 L 340.55 746.23 L 336.26 746.62 L 334.63 746.83 L 334.90 750.98 L 335.37 762.08 L 335.57 778.07 L 335.42 787.15 L 335.01 796.92 L 333.51 818.93 L 331.66 840.94 L 329.74 861.17 L 328.01 877.83 L 326.77 889.14 L 326.29 893.31 L 339.55 893.31 L 340.76 889.16 L 343.87 877.86 L 348.11 861.11 L 350.38 851.39 L 352.72 840.61 L 354.92 829.55 L 356.94 818.07 L 358.66 806.53 L 359.99 795.20 L 360.85 784.03 L 361.11 773.71 L 362.63 782.57 L 363.98 792.90 L 365.05 803.59 L 365.93 814.95 L 366.61 826.42 L 367.13 837.76 L 367.77 859.18 L 368.01 877.11 L 368.02 889.42 L 367.99 894.00 L 381.94 892.61 L 382.31 888.82 L 383.26 878.52 L 384.55 863.34 L 385.94 844.89 L 387.20 824.80 L 388.08 804.68 L 388.29 792.94 L 388.23 782.61 L 387.96 772.85 L 387.60 765.02 L 386.79 753.38 L 386.38 749.17 L 379.53 748.53 L 372.67 748.45 L 365.80 748.93 L 365.75 748.94 L 360.73 747.50 L 357.97 746.90 L 355.08 746.45 L 351.10 746.11 L 347.27 746.00 L 346.63 746.00 Z"
                                fill="url(#linearGradient-16)" fill-rule="nonzero" group-id="4" id="腿" node-id="110"
                                stroke="none" target-height="148" target-width="61.99405" target-x="326.292"
                                target-y="746" />
                            <path d="M 346.00 635.00 L 365.00 635.00 L 365.00 654.00 L 346.00 654.00 Z"
                                fill="url(#linearGradient-17)" fill-rule="evenodd" group-id="4,14" id="矩形" node-id="112"
                                stroke="none" target-height="19" target-width="19" target-x="346" target-y="635" />
                            <path
                                d="M 364.27 641.18 L 368.73 639.93 L 372.23 638.42 L 374.93 636.68 L 377.28 634.49 L 379.08 632.02 L 380.39 629.25 L 381.25 626.27 L 381.80 622.93 L 382.00 619.18 L 381.79 613.39 L 381.12 606.72 L 379.70 602.99 L 377.94 599.58 L 375.81 596.48 L 373.33 593.66 L 370.62 591.21 L 367.67 589.14 L 364.49 587.44 L 361.20 586.18 L 357.78 585.36 L 354.29 585.01 L 350.79 585.16 L 347.24 585.82 L 343.84 587.02 L 340.79 588.62 L 338.04 590.64 L 335.61 593.03 L 333.53 595.71 L 331.80 598.72 L 330.48 601.94 L 329.57 605.34 L 329.08 608.97 L 329.04 612.64 L 329.47 616.39 L 330.40 620.28 L 331.81 624.01 L 333.58 627.42 L 335.71 630.52 L 338.19 633.34 L 340.90 635.79 L 343.85 637.86 L 347.03 639.56 L 350.31 640.82 L 353.73 641.64 L 357.22 641.99 L 360.73 641.84 L 364.27 641.18 Z"
                                fill="url(#linearGradient-18)" fill-rule="evenodd" group-id="4,14" id="椭圆形" node-id="113"
                                stroke="none" target-height="56.985107" target-width="52.96115" target-x="329.03506"
                                target-y="585.00745" />
                            <path
                                d="M 345.63 638.00 L 340.08 636.31 L 335.43 634.41 L 331.57 632.34 L 328.40 630.10 L 325.82 627.72 L 323.78 625.19 L 322.22 622.48 L 320.74 618.78 L 319.73 615.09 L 319.17 611.38 L 319.01 607.63 L 319.23 604.18 L 319.82 600.97 L 320.82 597.88 L 322.08 595.36 L 323.60 593.33 L 323.10 592.47 L 322.34 591.55 L 321.41 590.71 L 320.25 589.94 L 322.58 589.22 L 324.97 588.95 L 325.97 589.03 L 326.51 589.23 L 326.71 587.18 L 327.50 584.43 L 328.09 583.15 L 328.71 582.32 L 328.75 583.88 L 329.27 586.47 L 330.36 584.78 L 332.20 582.98 L 334.99 581.04 L 339.03 578.96 L 344.62 576.72 L 348.71 576.18 L 350.97 576.02 L 353.72 576.04 L 356.65 576.33 L 360.38 577.03 L 363.40 577.79 L 365.30 578.43 L 368.13 579.64 L 371.28 581.25 L 375.83 583.93 L 374.21 584.04 L 373.53 584.21 L 377.44 586.93 L 380.79 589.68 L 383.63 592.46 L 386.00 595.29 L 384.55 595.86 L 383.56 595.97 L 385.39 596.90 L 380.16 596.90 L 383.56 603.37 L 379.83 600.10 L 376.36 597.75 L 373.10 596.19 L 370.02 595.29 L 368.05 594.64 L 367.13 594.58 L 366.76 594.82 L 366.50 595.48 L 366.44 596.90 L 366.31 598.51 L 365.84 600.63 L 364.45 604.97 L 363.16 608.63 L 362.14 611.05 L 361.33 613.14 L 360.09 615.63 L 357.40 621.20 L 354.09 626.99 L 352.75 622.48 L 350.67 621.13 L 349.06 620.61 L 347.76 620.68 L 346.64 621.27 L 345.63 622.48 L 344.69 624.52 L 344.29 626.66 L 344.40 628.08 L 344.90 629.41 L 345.82 630.70 L 347.04 631.71 L 348.90 632.58 L 351.58 633.27 L 349.52 633.99 L 347.89 635.01 L 346.61 636.33 L 345.63 638.00 Z"
                                fill="#000000" fill-rule="evenodd" group-id="4,14" id="路径-66" node-id="114" stroke="none"
                                target-height="61.979187" target-width="66.99396" target-x="319.00604"
                                target-y="576.0208" />
                            <path
                                d="M 366.78 646.00 L 368.21 646.71 L 371.67 648.81 L 373.72 650.33 L 375.92 652.24 L 377.95 654.43 L 379.75 656.95 L 381.74 660.64 L 383.60 664.75 L 385.24 668.99 L 386.68 673.18 L 388.94 680.88 L 390.33 686.50 L 390.81 688.68 L 391.06 690.58 L 391.50 692.61 L 392.42 695.75 L 393.71 699.14 L 395.76 703.41 L 398.18 707.73 L 399.78 710.33 L 401.96 713.33 L 402.62 713.98 L 403.78 714.75 L 406.47 716.47 L 409.52 718.27 L 411.78 719.27 L 414.91 720.28 L 418.24 721.62 L 419.78 722.29 L 415.97 734.00 L 413.35 733.70 L 406.75 732.65 L 402.64 731.82 L 398.09 730.68 L 393.56 729.28 L 389.28 727.58 L 386.40 725.91 L 384.02 723.89 L 382.01 721.60 L 380.48 719.39 L 379.23 717.19 L 378.47 715.58 L 377.84 713.98 L 366.78 646.00 Z"
                                fill="url(#linearGradient-19)" fill-rule="nonzero" group-id="4,15" id="胳膊" node-id="116"
                                stroke="none" target-height="88" target-width="53" target-x="366.78217" target-y="646" />
                            <path
                                d="M 362.91 654.20 L 346.34 645.00 L 345.49 645.80 L 344.18 647.11 L 342.56 648.31 L 341.86 648.84 L 340.69 649.62 L 338.08 651.80 L 336.66 653.34 L 335.36 655.20 L 334.65 656.82 L 334.02 659.17 L 333.57 661.73 L 333.23 664.56 L 332.84 670.04 L 332.72 674.29 L 332.71 676.00 L 332.77 678.07 L 332.84 683.58 L 332.75 691.44 L 332.33 700.58 L 331.55 713.84 L 330.95 726.63 L 330.53 737.54 L 330.28 745.12 L 330.20 747.97 L 333.09 748.11 L 340.43 748.45 L 350.21 748.79 L 360.41 748.99 L 370.36 748.91 L 378.93 748.65 L 384.94 748.37 L 387.20 748.23 L 378.88 671.46 L 378.60 669.29 L 377.65 663.94 L 376.86 660.67 L 375.79 657.15 L 374.44 653.73 L 372.82 650.66 L 371.53 649.13 L 369.94 647.91 L 368.22 646.96 L 366.81 646.35 L 365.34 645.86 L 362.91 654.20 Z"
                                fill="url(#linearGradient-20)" fill-rule="nonzero" group-id="4,15" id="衣服" node-id="117"
                                stroke="none" target-height="103.99237" target-width="57" target-x="330.19946"
                                target-y="645" />
                            <path
                                d="M 340.78 649.00 L 339.54 649.84 L 336.61 652.03 L 333.18 655.08 L 331.63 656.80 L 330.47 658.48 L 329.59 660.49 L 328.67 663.68 L 327.93 667.21 L 327.23 671.37 L 326.12 680.03 L 325.35 688.11 L 324.89 694.08 L 324.74 696.41 L 324.66 697.94 L 324.72 699.48 L 325.01 701.57 L 325.60 703.70 L 326.65 705.90 L 327.63 707.08 L 329.67 708.92 L 335.11 713.01 L 341.63 717.45 L 347.92 721.51 L 352.66 724.47 L 354.54 725.62 L 375.16 737.00 L 381.66 722.59 L 346.52 696.79 L 345.67 695.94 L 345.04 695.01 L 344.60 693.76 L 344.82 690.96 L 345.56 685.70 L 346.51 679.77 L 347.32 674.91 L 347.66 672.90 L 347.93 670.70 L 348.07 668.48 L 348.04 665.55 L 347.69 662.55 L 346.90 659.62 L 345.80 657.11 L 344.48 654.65 L 341.95 650.65 L 340.78 649.00 Z"
                                fill="url(#linearGradient-21)" fill-rule="nonzero" group-id="4,15" id="胳膊-2" node-id="118"
                                stroke="none" target-height="88" target-width="56.999817" target-x="324.66113"
                                target-y="649" />
                            <path
                                d="M 425.15 704.00 L 386.08 704.00 L 385.36 704.14 L 384.74 704.54 L 384.33 705.15 L 384.19 705.86 L 383.05 731.14 L 383.19 731.85 L 383.61 732.46 L 384.22 732.86 L 384.95 733.00 L 422.50 733.00 L 423.23 732.86 L 423.84 732.46 L 424.25 731.85 L 424.40 731.14 L 427.05 705.86 L 426.91 705.15 L 426.50 704.54 L 425.88 704.14 L 425.15 704.00 L 425.15 704.00 Z"
                                fill="#483029" fill-rule="evenodd" group-id="4,15" id="iPad" node-id="119" stroke="none"
                                target-height="29" target-width="44" target-x="383.0503" target-y="704" />
                            <path
                                d="M 381.43 723.00 L 392.43 723.36 L 392.93 723.56 L 393.25 723.99 L 393.46 725.14 L 393.26 725.78 L 392.77 726.21 L 390.03 727.29 L 392.07 727.74 L 394.14 728.00 L 399.62 728.00 L 399.92 728.04 L 400.45 728.47 L 400.62 728.93 L 400.65 729.78 L 400.39 731.98 L 400.10 733.94 L 399.96 734.78 L 399.81 735.33 L 399.55 735.83 L 399.05 736.43 L 398.34 736.91 L 397.22 737.28 L 394.15 737.64 L 390.54 737.86 L 387.53 737.97 L 386.27 738.00 L 383.35 737.93 L 380.45 737.64 L 378.51 737.16 L 376.55 736.52 L 375.66 736.21 L 376.07 735.16 L 377.08 732.56 L 378.38 729.22 L 379.79 726.05 L 381.43 723.00 Z M 424.51 723.55 L 415.16 723.00 L 414.72 723.15 L 414.43 723.51 L 414.17 724.55 L 414.28 725.13 L 414.67 725.58 L 416.92 726.77 L 415.16 727.02 L 413.39 727.09 L 408.74 726.66 L 408.24 726.77 L 407.94 727.13 L 407.75 728.20 L 407.81 730.22 L 407.92 732.02 L 407.98 732.81 L 408.19 733.66 L 408.65 734.39 L 409.30 734.95 L 410.12 735.30 L 413.71 736.05 L 417.56 736.60 L 419.36 736.82 L 421.83 736.99 L 424.32 736.96 L 425.32 736.93 L 426.30 736.66 L 426.95 735.99 L 427.42 735.18 L 427.71 732.86 L 427.70 730.56 L 427.38 728.25 L 426.47 725.12 L 426.18 724.52 L 425.73 724.04 L 425.17 723.71 L 424.51 723.55 L 424.51 723.55 Z"
                                fill="#fee0bc" fill-rule="evenodd" group-id="4,15" id="手" node-id="120" stroke="none"
                                target-height="14.99646" target-width="52.053497" target-x="375.66125" target-y="723" />
                            <path
                                d="M 285.00 904.50 L 285.25 906.42 L 285.95 908.33 L 287.16 910.26 L 288.98 912.24 L 291.74 914.47 L 295.37 916.72 L 300.05 918.97 L 304.87 920.84 L 310.47 922.61 L 316.93 924.27 L 323.44 925.62 L 330.57 926.79 L 338.35 927.75 L 346.14 928.43 L 354.35 928.85 L 363.00 929.00 L 371.65 928.85 L 379.86 928.43 L 387.65 927.75 L 395.43 926.79 L 402.56 925.62 L 409.07 924.27 L 415.53 922.61 L 421.13 920.84 L 425.95 918.97 L 430.63 916.72 L 434.26 914.47 L 437.02 912.24 L 438.84 910.26 L 440.05 908.33 L 440.75 906.42 L 441.00 904.50 L 440.75 902.58 L 440.05 900.67 L 438.84 898.74 L 437.02 896.76 L 434.26 894.53 L 430.63 892.28 L 425.95 890.03 L 421.13 888.16 L 415.53 886.39 L 409.07 884.73 L 402.56 883.38 L 395.43 882.21 L 387.65 881.25 L 379.86 880.57 L 371.65 880.15 L 363.00 880.00 L 354.35 880.15 L 346.14 880.57 L 338.35 881.25 L 330.57 882.21 L 323.44 883.38 L 316.93 884.73 L 310.47 886.39 L 304.87 888.16 L 300.05 890.03 L 295.37 892.28 L 291.74 894.53 L 288.98 896.76 L 287.16 898.74 L 285.95 900.67 L 285.25 902.58 L 285.00 904.50 Z"
                                fill="#f1bc01" fill-opacity="0.3" fill-rule="evenodd" group-id="5,16" id="椭圆形" node-id="122"
                                stroke="none" target-height="49" target-width="156" target-x="285" target-y="880" />
                            <path
                                d="M 378.03 889.54 L 379.10 896.46 L 382.29 896.74 L 385.70 897.44 L 389.38 898.60 L 393.35 900.26 L 394.85 901.29 L 395.72 902.04 L 396.35 902.82 L 396.67 903.51 L 396.91 905.10 L 396.68 905.41 L 395.44 905.74 L 391.83 905.98 L 383.86 905.88 L 368.91 905.10 L 368.91 887.00 L 378.03 889.54 Z"
                                fill="#333333" fill-rule="nonzero" group-id="5" id="路径-52" node-id="123" stroke="none"
                                target-height="18.981384" target-width="27.999603" target-x="368.91052" target-y="887" />
                            <path
                                d="M 337.03 889.54 L 338.10 896.46 L 341.29 896.74 L 344.70 897.44 L 348.38 898.60 L 352.35 900.26 L 353.85 901.29 L 354.72 902.04 L 355.35 902.82 L 355.67 903.51 L 355.91 905.10 L 355.68 905.41 L 354.44 905.74 L 350.83 905.98 L 342.86 905.88 L 327.91 905.10 L 327.91 887.00 L 337.03 889.54 Z"
                                fill="#333333" fill-rule="nonzero" group-id="5" id="路径-52备份-2" node-id="124" stroke="none"
                                target-height="18.981384" target-width="27.999603" target-x="327.91052" target-y="887" />
                            <path
                                d="M 346.63 746.00 L 340.55 746.23 L 336.26 746.62 L 334.63 746.83 L 334.90 750.98 L 335.37 762.08 L 335.57 778.07 L 335.42 787.15 L 335.01 796.92 L 333.51 818.93 L 331.66 840.94 L 329.74 861.17 L 328.01 877.83 L 326.77 889.14 L 326.29 893.31 L 339.55 893.31 L 340.76 889.16 L 343.87 877.86 L 348.11 861.11 L 350.38 851.39 L 352.72 840.61 L 354.92 829.55 L 356.94 818.07 L 358.66 806.53 L 359.99 795.20 L 360.85 784.03 L 361.11 773.71 L 362.63 782.57 L 363.98 792.90 L 365.05 803.59 L 365.93 814.95 L 366.61 826.42 L 367.13 837.76 L 367.77 859.18 L 368.01 877.11 L 368.02 889.42 L 367.99 894.00 L 381.94 892.61 L 382.31 888.82 L 383.26 878.52 L 384.55 863.34 L 385.94 844.89 L 387.20 824.80 L 388.08 804.68 L 388.29 792.94 L 388.23 782.61 L 387.96 772.85 L 387.60 765.02 L 386.79 753.38 L 386.38 749.17 L 379.53 748.53 L 372.67 748.45 L 365.80 748.93 L 365.75 748.94 L 360.73 747.50 L 357.97 746.90 L 355.08 746.45 L 351.10 746.11 L 347.27 746.00 L 346.63 746.00 Z"
                                fill="url(#linearGradient-16)" fill-rule="nonzero" group-id="5" id="腿" node-id="125"
                                stroke="none" target-height="148" target-width="61.99405" target-x="326.292"
                                target-y="746" />
                            <path d="M 346.00 635.00 L 365.00 635.00 L 365.00 654.00 L 346.00 654.00 Z"
                                fill="url(#linearGradient-17)" fill-rule="evenodd" group-id="5,17" id="矩形" node-id="127"
                                stroke="none" target-height="19" target-width="19" target-x="346" target-y="635" />
                            <path
                                d="M 364.27 641.18 L 368.73 639.93 L 372.23 638.42 L 374.93 636.68 L 377.28 634.49 L 379.08 632.02 L 380.39 629.25 L 381.25 626.27 L 381.80 622.93 L 382.00 619.18 L 381.79 613.39 L 381.12 606.72 L 379.70 602.99 L 377.94 599.58 L 375.81 596.48 L 373.33 593.66 L 370.62 591.21 L 367.67 589.14 L 364.49 587.44 L 361.20 586.18 L 357.78 585.36 L 354.29 585.01 L 350.79 585.16 L 347.24 585.82 L 343.84 587.02 L 340.79 588.62 L 338.04 590.64 L 335.61 593.03 L 333.53 595.71 L 331.80 598.72 L 330.48 601.94 L 329.57 605.34 L 329.08 608.97 L 329.04 612.64 L 329.47 616.39 L 330.40 620.28 L 331.81 624.01 L 333.58 627.42 L 335.71 630.52 L 338.19 633.34 L 340.90 635.79 L 343.85 637.86 L 347.03 639.56 L 350.31 640.82 L 353.73 641.64 L 357.22 641.99 L 360.73 641.84 L 364.27 641.18 Z"
                                fill="url(#linearGradient-18)" fill-rule="evenodd" group-id="5,17" id="椭圆形" node-id="128"
                                stroke="none" target-height="56.985107" target-width="52.96115" target-x="329.03506"
                                target-y="585.00745" />
                            <path
                                d="M 345.63 638.00 L 340.08 636.31 L 335.43 634.41 L 331.57 632.34 L 328.40 630.10 L 325.82 627.72 L 323.78 625.19 L 322.22 622.48 L 320.74 618.78 L 319.73 615.09 L 319.17 611.38 L 319.01 607.63 L 319.23 604.18 L 319.82 600.97 L 320.82 597.88 L 322.08 595.36 L 323.60 593.33 L 323.10 592.47 L 322.34 591.55 L 321.41 590.71 L 320.25 589.94 L 322.58 589.22 L 324.97 588.95 L 325.97 589.03 L 326.51 589.23 L 326.71 587.18 L 327.50 584.43 L 328.09 583.15 L 328.71 582.32 L 328.75 583.88 L 329.27 586.47 L 330.36 584.78 L 332.20 582.98 L 334.99 581.04 L 339.03 578.96 L 344.62 576.72 L 348.71 576.18 L 350.97 576.02 L 353.72 576.04 L 356.65 576.33 L 360.38 577.03 L 363.40 577.79 L 365.30 578.43 L 368.13 579.64 L 371.28 581.25 L 375.83 583.93 L 374.21 584.04 L 373.53 584.21 L 377.44 586.93 L 380.79 589.68 L 383.63 592.46 L 386.00 595.29 L 384.55 595.86 L 383.56 595.97 L 385.39 596.90 L 380.16 596.90 L 383.56 603.37 L 379.83 600.10 L 376.36 597.75 L 373.10 596.19 L 370.02 595.29 L 368.05 594.64 L 367.13 594.58 L 366.76 594.82 L 366.50 595.48 L 366.44 596.90 L 366.31 598.51 L 365.84 600.63 L 364.45 604.97 L 363.16 608.63 L 362.14 611.05 L 361.33 613.14 L 360.09 615.63 L 357.40 621.20 L 354.09 626.99 L 352.75 622.48 L 350.67 621.13 L 349.06 620.61 L 347.76 620.68 L 346.64 621.27 L 345.63 622.48 L 344.69 624.52 L 344.29 626.66 L 344.40 628.08 L 344.90 629.41 L 345.82 630.70 L 347.04 631.71 L 348.90 632.58 L 351.58 633.27 L 349.52 633.99 L 347.89 635.01 L 346.61 636.33 L 345.63 638.00 Z"
                                fill="#000000" fill-rule="evenodd" group-id="5,17" id="路径-66" node-id="129" stroke="none"
                                target-height="61.979187" target-width="66.99396" target-x="319.00604"
                                target-y="576.0208" />
                            <path
                                d="M 366.78 646.00 L 368.21 646.71 L 371.67 648.81 L 373.72 650.33 L 375.92 652.24 L 377.95 654.43 L 379.75 656.95 L 381.74 660.64 L 383.60 664.75 L 385.24 668.99 L 386.68 673.18 L 388.94 680.88 L 390.33 686.50 L 390.81 688.68 L 391.06 690.58 L 391.50 692.61 L 392.42 695.75 L 393.71 699.14 L 395.76 703.41 L 398.18 707.73 L 399.78 710.33 L 401.96 713.33 L 402.62 713.98 L 403.78 714.75 L 406.47 716.47 L 409.52 718.27 L 411.78 719.27 L 414.91 720.28 L 418.24 721.62 L 419.78 722.29 L 415.97 734.00 L 413.35 733.70 L 406.75 732.65 L 402.64 731.82 L 398.09 730.68 L 393.56 729.28 L 389.28 727.58 L 386.40 725.91 L 384.02 723.89 L 382.01 721.60 L 380.48 719.39 L 379.23 717.19 L 378.47 715.58 L 377.84 713.98 L 366.78 646.00 Z"
                                fill="url(#linearGradient-19)" fill-rule="nonzero" group-id="5,18" id="胳膊" node-id="131"
                                stroke="none" target-height="88" target-width="53" target-x="366.78217" target-y="646" />
                            <path
                                d="M 362.91 654.20 L 346.34 645.00 L 345.49 645.80 L 344.18 647.11 L 342.56 648.31 L 341.86 648.84 L 340.69 649.62 L 338.08 651.80 L 336.66 653.34 L 335.36 655.20 L 334.65 656.82 L 334.02 659.17 L 333.57 661.73 L 333.23 664.56 L 332.84 670.04 L 332.72 674.29 L 332.71 676.00 L 332.77 678.07 L 332.84 683.58 L 332.75 691.44 L 332.33 700.58 L 331.55 713.84 L 330.95 726.63 L 330.53 737.54 L 330.28 745.12 L 330.20 747.97 L 333.09 748.11 L 340.43 748.45 L 350.21 748.79 L 360.41 748.99 L 370.36 748.91 L 378.93 748.65 L 384.94 748.37 L 387.20 748.23 L 378.88 671.46 L 378.60 669.29 L 377.65 663.94 L 376.86 660.67 L 375.79 657.15 L 374.44 653.73 L 372.82 650.66 L 371.53 649.13 L 369.94 647.91 L 368.22 646.96 L 366.81 646.35 L 365.34 645.86 L 362.91 654.20 Z"
                                fill="url(#linearGradient-20)" fill-rule="nonzero" group-id="5,18" id="衣服" node-id="132"
                                stroke="none" target-height="103.99237" target-width="57" target-x="330.19946"
                                target-y="645" />
                            <path
                                d="M 340.78 649.00 L 339.54 649.84 L 336.61 652.03 L 333.18 655.08 L 331.63 656.80 L 330.47 658.48 L 329.59 660.49 L 328.67 663.68 L 327.93 667.21 L 327.23 671.37 L 326.12 680.03 L 325.35 688.11 L 324.89 694.08 L 324.74 696.41 L 324.66 697.94 L 324.72 699.48 L 325.01 701.57 L 325.60 703.70 L 326.65 705.90 L 327.63 707.08 L 329.67 708.92 L 335.11 713.01 L 341.63 717.45 L 347.92 721.51 L 352.66 724.47 L 354.54 725.62 L 375.16 737.00 L 381.66 722.59 L 346.52 696.79 L 345.67 695.94 L 345.04 695.01 L 344.60 693.76 L 344.82 690.96 L 345.56 685.70 L 346.51 679.77 L 347.32 674.91 L 347.66 672.90 L 347.93 670.70 L 348.07 668.48 L 348.04 665.55 L 347.69 662.55 L 346.90 659.62 L 345.80 657.11 L 344.48 654.65 L 341.95 650.65 L 340.78 649.00 Z"
                                fill="url(#linearGradient-21)" fill-rule="nonzero" group-id="5,18" id="胳膊-2" node-id="133"
                                stroke="none" target-height="88" target-width="56.999817" target-x="324.66113"
                                target-y="649" />
                            <path
                                d="M 425.15 704.00 L 386.08 704.00 L 385.36 704.14 L 384.74 704.54 L 384.33 705.15 L 384.19 705.86 L 383.05 731.14 L 383.19 731.85 L 383.61 732.46 L 384.22 732.86 L 384.95 733.00 L 422.50 733.00 L 423.23 732.86 L 423.84 732.46 L 424.25 731.85 L 424.40 731.14 L 427.05 705.86 L 426.91 705.15 L 426.50 704.54 L 425.88 704.14 L 425.15 704.00 L 425.15 704.00 Z"
                                fill="#483029" fill-rule="evenodd" group-id="5,18" id="iPad" node-id="134" stroke="none"
                                target-height="29" target-width="44" target-x="383.0503" target-y="704" />
                            <path
                                d="M 381.43 723.00 L 392.43 723.36 L 392.93 723.56 L 393.25 723.99 L 393.46 725.14 L 393.26 725.78 L 392.77 726.21 L 390.03 727.29 L 392.07 727.74 L 394.14 728.00 L 399.62 728.00 L 399.92 728.04 L 400.45 728.47 L 400.62 728.93 L 400.65 729.78 L 400.39 731.98 L 400.10 733.94 L 399.96 734.78 L 399.81 735.33 L 399.55 735.83 L 399.05 736.43 L 398.34 736.91 L 397.22 737.28 L 394.15 737.64 L 390.54 737.86 L 387.53 737.97 L 386.27 738.00 L 383.35 737.93 L 380.45 737.64 L 378.51 737.16 L 376.55 736.52 L 375.66 736.21 L 376.07 735.16 L 377.08 732.56 L 378.38 729.22 L 379.79 726.05 L 381.43 723.00 Z M 424.51 723.55 L 415.16 723.00 L 414.72 723.15 L 414.43 723.51 L 414.17 724.55 L 414.28 725.13 L 414.67 725.58 L 416.92 726.77 L 415.16 727.02 L 413.39 727.09 L 408.74 726.66 L 408.24 726.77 L 407.94 727.13 L 407.75 728.20 L 407.81 730.22 L 407.92 732.02 L 407.98 732.81 L 408.19 733.66 L 408.65 734.39 L 409.30 734.95 L 410.12 735.30 L 413.71 736.05 L 417.56 736.60 L 419.36 736.82 L 421.83 736.99 L 424.32 736.96 L 425.32 736.93 L 426.30 736.66 L 426.95 735.99 L 427.42 735.18 L 427.71 732.86 L 427.70 730.56 L 427.38 728.25 L 426.47 725.12 L 426.18 724.52 L 425.73 724.04 L 425.17 723.71 L 424.51 723.55 L 424.51 723.55 Z"
                                fill="#fee0bc" fill-rule="evenodd" group-id="5,18" id="手" node-id="135" stroke="none"
                                target-height="14.99646" target-width="52.053497" target-x="375.66125" target-y="723" />
                            <path
                                d="M 886.00 873.50 L 885.84 874.07 L 885.36 874.65 L 884.43 875.27 L 882.75 875.94 L 880.30 876.52 L 877.63 876.87 L 874.50 877.00 L 871.37 876.87 L 868.70 876.52 L 866.25 875.94 L 864.57 875.27 L 863.64 874.65 L 863.16 874.07 L 863.00 873.50 L 863.16 872.93 L 863.64 872.35 L 864.57 871.73 L 866.25 871.06 L 868.70 870.48 L 871.37 870.13 L 874.50 870.00 L 877.63 870.13 L 880.30 870.48 L 882.75 871.06 L 884.43 871.73 L 885.36 872.35 L 885.84 872.93 L 886.00 873.50 Z"
                                fill="#825852" fill-rule="evenodd" group-id="6" id="椭圆形" node-id="137" stroke="none"
                                target-height="7" target-width="23" target-x="863" target-y="870" />
                            <path
                                d="M 862.00 871.79 L 862.81 862.40 L 864.00 854.47 L 865.51 847.81 L 867.28 842.26 L 869.26 837.70 L 871.42 833.97 L 873.75 830.96 L 876.23 828.59 L 878.88 826.77 L 881.72 825.46 L 885.09 825.05 L 886.65 825.01 L 887.80 825.20 L 888.64 825.70 L 889.00 826.60 L 888.82 827.79 L 887.81 829.92 L 886.59 831.51 L 885.02 832.92 L 881.09 836.25 L 878.93 838.61 L 876.30 842.28 L 873.84 846.70 L 870.95 853.34 L 868.30 860.99 L 865.30 871.77 L 864.58 872.72 L 863.88 873.00 L 863.07 872.77 L 862.00 871.79 Z"
                                fill="url(#linearGradient-22)" fill-rule="evenodd" group-id="6" id="路径-42" node-id="138"
                                stroke="none" target-height="47.98584" target-width="26.995422" target-x="862"
                                target-y="825.0131" />
                            <path
                                d="M 861.74 871.12 L 859.04 850.86 L 856.93 837.47 L 855.33 829.18 L 854.14 824.51 L 852.14 818.00 L 851.18 814.42 L 850.44 811.00 L 850.03 807.70 L 850.11 805.16 L 850.53 803.68 L 851.24 802.71 L 852.27 802.13 L 853.48 801.99 L 855.30 802.37 L 857.99 803.54 L 859.80 804.74 L 861.48 806.33 L 863.05 808.33 L 864.50 810.81 L 866.04 814.28 L 867.35 818.30 L 868.43 822.93 L 869.19 827.63 L 869.70 832.59 L 869.96 837.85 L 869.89 845.72 L 869.29 853.51 L 868.16 861.10 L 866.60 867.87 L 865.35 870.93 L 864.41 872.40 L 863.70 872.94 L 863.10 872.95 L 862.48 872.46 L 861.74 871.12 Z"
                                fill="url(#linearGradient-23)" fill-rule="evenodd" group-id="6" id="路径-41" node-id="139"
                                stroke="none" target-height="70.95471" target-width="19.937439" target-x="850.0268"
                                target-y="801.9944" />
                            <path
                                d="M 187.00 800.00 L 196.65 803.28 L 205.64 806.91 L 211.42 809.66 L 216.92 812.70 L 222.13 816.03 L 227.09 819.72 L 231.79 823.87 L 236.24 828.47 L 240.29 833.44 L 244.13 839.05 L 247.73 845.37 L 251.59 841.22 L 255.39 837.71 L 259.12 834.77 L 262.81 832.37 L 268.08 829.60 L 273.30 827.51 L 278.49 826.04 L 283.80 825.02 L 289.08 824.37 L 294.35 824.08 L 302.25 824.02 L 310.00 824.20 L 303.68 825.60 L 298.02 827.42 L 292.97 829.63 L 288.45 832.20 L 284.43 835.14 L 280.86 838.45 L 277.70 842.15 L 274.96 846.26 L 272.61 850.83 L 270.66 855.90 L 269.13 861.54 L 268.06 867.79 L 267.47 874.74 L 267.43 882.45 L 267.99 891.00 L 257.51 890.59 L 245.05 890.98 L 230.06 890.82 L 224.00 891.00 L 224.13 890.61 L 218.66 890.36 L 218.74 889.99 L 198.04 889.76 L 198.94 880.70 L 199.15 872.63 L 198.76 865.46 L 197.84 859.10 L 196.43 853.44 L 194.58 848.43 L 192.30 843.98 L 189.62 840.04 L 186.52 836.55 L 182.98 833.49 L 178.97 830.84 L 174.43 828.59 L 169.31 826.75 L 163.52 825.35 L 157.00 824.43 L 164.31 824.02 L 171.15 824.16 L 177.57 824.80 L 183.61 825.93 L 189.61 827.62 L 195.17 829.74 L 200.33 832.30 L 205.12 835.30 L 209.61 838.77 L 213.68 842.64 L 217.36 846.91 L 220.66 851.62 L 219.48 845.18 L 217.82 839.08 L 215.69 833.30 L 213.10 827.81 L 210.04 822.59 L 206.50 817.62 L 202.46 812.89 L 197.88 808.38 L 192.74 804.08 L 187.00 800.00 Z"
                                fill="url(#linearGradient-24)" fill-rule="evenodd" group-id="7" id="形状结合" node-id="141"
                                stroke="none" target-height="91" target-width="153" target-x="157" target-y="800" />
                            <path
                                d="M 268.00 913.00 L 267.67 915.01 L 266.73 917.00 L 265.07 919.04 L 262.50 921.17 L 258.76 923.43 L 253.83 925.67 L 247.50 927.85 L 241.06 929.56 L 233.68 931.07 L 225.25 932.35 L 216.80 933.24 L 207.73 933.80 L 198.00 934.00 L 188.27 933.80 L 179.20 933.24 L 170.75 932.35 L 162.32 931.07 L 154.94 929.56 L 148.50 927.85 L 142.17 925.67 L 137.24 923.43 L 133.50 921.17 L 130.93 919.04 L 129.27 917.00 L 128.33 915.01 L 128.00 913.00 L 128.33 910.99 L 129.27 909.00 L 130.93 906.96 L 133.50 904.83 L 137.24 902.57 L 142.17 900.33 L 148.50 898.15 L 154.94 896.44 L 162.32 894.93 L 170.75 893.65 L 179.20 892.76 L 188.27 892.20 L 198.00 892.00 L 207.73 892.20 L 216.80 892.76 L 225.25 893.65 L 233.68 894.93 L 241.06 896.44 L 247.50 898.15 L 253.83 900.33 L 258.76 902.57 L 262.50 904.83 L 265.07 906.96 L 266.73 909.00 L 267.67 910.99 L 268.00 913.00 Z"
                                fill="#825852" fill-rule="evenodd" group-id="7" id="椭圆形" node-id="142" stroke="none"
                                target-height="42" target-width="140" target-x="128" target-y="892" />
                            <path
                                d="M 178.16 916.00 L 195.53 915.85 L 203.49 915.37 L 210.35 914.42 L 214.73 913.38 L 218.55 911.99 L 221.88 910.28 L 224.15 908.67 L 226.14 906.76 L 227.87 904.53 L 229.34 901.96 L 230.43 899.27 L 231.26 896.11 L 231.80 892.38 L 232.00 888.02 L 231.69 882.62 L 230.86 877.47 L 229.51 872.53 L 227.64 867.77 L 225.29 863.21 L 222.53 858.94 L 219.35 854.96 L 215.74 851.24 L 211.81 847.88 L 207.57 844.91 L 203.01 842.31 L 198.10 840.09 L 193.04 838.34 L 187.78 837.07 L 182.27 836.29 L 176.50 836.00 L 170.73 836.29 L 165.22 837.07 L 159.96 838.34 L 154.90 840.09 L 149.99 842.31 L 145.43 844.91 L 141.19 847.88 L 137.26 851.24 L 133.65 854.96 L 130.47 858.94 L 127.71 863.21 L 125.36 867.77 L 123.49 872.53 L 122.14 877.47 L 121.31 882.62 L 121.00 888.02 L 121.23 892.36 L 121.84 896.08 L 122.77 899.25 L 124.00 901.96 L 125.64 904.51 L 127.56 906.73 L 129.77 908.65 L 132.29 910.28 L 135.94 911.99 L 140.08 913.39 L 144.80 914.42 L 152.14 915.37 L 160.45 915.85 L 178.16 916.00 Z"
                                fill="url(#linearGradient-25)" fill-rule="evenodd" group-id="7" id="椭圆形" node-id="143"
                                stroke="none" target-height="79.99817" target-width="111" target-x="121" target-y="836" />
                            <path
                                d="M 238.53 916.00 L 245.58 915.98 L 251.80 915.80 L 255.84 915.46 L 259.36 914.86 L 262.41 914.03 L 265.25 912.77 L 267.57 911.09 L 269.45 908.96 L 270.48 907.15 L 271.27 904.91 L 271.80 902.18 L 272.00 898.86 L 271.67 894.49 L 270.77 890.37 L 269.29 886.46 L 267.28 882.78 L 264.83 879.41 L 261.90 876.33 L 258.59 873.65 L 254.95 871.37 L 250.93 869.50 L 246.71 868.14 L 242.25 867.30 L 237.50 867.00 L 232.75 867.30 L 228.29 868.14 L 224.07 869.50 L 220.05 871.37 L 216.41 873.65 L 213.10 876.33 L 210.17 879.41 L 207.72 882.78 L 205.71 886.46 L 204.23 890.37 L 203.33 894.49 L 203.00 898.86 L 203.23 902.16 L 203.82 904.89 L 204.70 907.13 L 205.87 908.96 L 207.38 910.59 L 209.16 911.98 L 211.22 913.12 L 213.62 914.03 L 216.94 914.86 L 220.69 915.46 L 224.94 915.80 L 231.43 915.98 L 238.53 916.00 Z"
                                fill="url(#linearGradient-26)" fill-rule="evenodd" group-id="7" id="椭圆形备份-6" node-id="144"
                                stroke="none" target-height="48.9989" target-width="69" target-x="203" target-y="867" />
                            <path
                                d="M 380.98 442.00 L 385.37 442.40 L 387.96 443.00 L 389.34 443.67 L 389.92 444.37 L 389.97 445.20 L 389.39 446.36 L 387.77 448.05 L 386.25 449.39 L 385.92 449.67 L 384.62 450.86 L 384.29 451.16 L 382.55 452.90 L 381.15 454.54 L 380.16 456.20 L 379.93 457.47 L 380.15 458.17 L 380.82 458.77 L 382.16 459.28 L 382.49 459.49 L 382.62 459.56 L 382.74 459.64 L 382.87 459.71 L 383.07 459.83 L 383.53 460.14 L 383.64 460.22 L 383.69 460.26 L 383.80 460.35 L 384.25 460.93 L 384.31 461.64 L 383.91 462.40 L 382.54 463.64 L 380.58 464.87 L 377.00 466.66 L 383.57 468.38 L 389.55 471.70 L 396.16 475.18 L 402.00 477.82 L 398.92 479.84 L 395.98 482.21 L 393.17 484.97 L 398.43 484.97 L 389.18 489.37 L 380.82 492.74 L 373.25 495.19 L 366.41 496.82 L 360.21 497.73 L 354.59 498.00 L 349.48 497.68 L 344.82 496.83 L 340.54 495.48 L 336.61 493.63 L 332.97 491.28 L 329.60 488.41 L 326.48 484.97 L 326.25 483.65 L 323.95 484.38 L 321.54 484.84 L 319.00 485.00 L 316.28 484.81 L 313.71 484.30 L 311.28 483.45 L 308.97 482.30 L 306.87 480.90 L 304.95 479.23 L 303.26 477.34 L 301.83 475.26 L 300.65 472.97 L 298.71 472.99 L 296.45 472.85 L 294.16 472.53 L 291.91 472.03 L 289.77 471.32 L 288.00 470.44 L 288.72 469.08 L 289.68 467.94 L 290.91 467.00 L 288.00 464.96 L 289.92 463.30 L 291.99 462.10 L 294.22 461.34 L 296.66 461.01 L 299.37 461.14 L 300.21 458.13 L 301.45 455.39 L 303.10 452.87 L 305.10 450.62 L 307.39 448.71 L 309.99 447.14 L 312.79 445.98 L 315.78 445.26 L 319.00 445.00 L 322.65 445.34 L 326.00 446.25 L 329.09 447.73 L 331.90 449.72 L 334.28 452.10 L 336.27 454.91 L 337.75 458.00 L 338.66 461.35 L 339.00 465.00 L 338.73 468.27 L 343.18 467.12 L 347.56 466.23 L 349.87 461.73 L 352.49 457.75 L 355.44 454.25 L 358.71 451.19 L 362.32 448.54 L 366.32 446.29 L 370.73 444.45 L 375.60 443.01 L 380.98 442.00 Z"
                                fill="#825852" fill-rule="evenodd" group-id="8" id="形状结合" node-id="146" stroke="none"
                                target-height="55.998993" target-width="114" target-x="288" target-y="442" />
                            <path
                                d="M 323.00 463.00 L 322.73 464.87 L 321.98 466.53 L 320.81 467.94 L 319.29 469.04 L 317.51 469.75 L 315.50 470.00 L 313.49 469.75 L 311.71 469.04 L 310.19 467.94 L 309.02 466.53 L 308.27 464.87 L 308.00 463.00 L 308.27 461.13 L 309.02 459.47 L 310.19 458.06 L 311.71 456.96 L 313.49 456.25 L 315.50 456.00 L 317.51 456.25 L 319.29 456.96 L 320.81 458.06 L 321.98 459.47 L 322.73 461.13 L 323.00 463.00 Z"
                                fill="#ffffff" fill-rule="evenodd" group-id="8" id="椭圆形" node-id="147" stroke="none"
                                target-height="14" target-width="15" target-x="308" target-y="456" />
                            <path
                                d="M 319.00 463.50 L 318.72 464.87 L 317.97 465.97 L 316.87 466.72 L 315.50 467.00 L 314.13 466.72 L 313.03 465.97 L 312.28 464.87 L 312.00 463.50 L 312.28 462.13 L 313.03 461.03 L 314.13 460.28 L 315.50 460.00 L 316.87 460.28 L 317.97 461.03 L 318.72 462.13 L 319.00 463.50 Z"
                                fill="#825852" fill-rule="evenodd" group-id="8" id="椭圆形" node-id="148" stroke="none"
                                target-height="7" target-width="7" target-x="312" target-y="460" />
                            <path
                                d="M 439.00 476.50 L 438.73 478.51 L 437.98 480.29 L 436.80 481.80 L 435.29 482.98 L 433.51 483.73 L 431.50 484.00 L 429.49 483.73 L 427.71 482.98 L 426.20 481.80 L 425.02 480.29 L 424.27 478.51 L 424.00 476.50 L 424.27 474.49 L 425.02 472.71 L 426.20 471.20 L 427.71 470.02 L 429.49 469.27 L 431.50 469.00 L 433.51 469.27 L 435.29 470.02 L 436.80 471.20 L 437.98 472.71 L 438.73 474.49 L 439.00 476.50 Z"
                                fill="#825852" fill-rule="evenodd" group-id="8" id="椭圆形" node-id="149" stroke="none"
                                target-height="15" target-width="15" target-x="424" target-y="469" />
                            <path
                                d="M 476.00 476.50 L 475.73 478.51 L 474.98 480.29 L 473.80 481.80 L 472.29 482.98 L 470.51 483.73 L 468.50 484.00 L 466.49 483.73 L 464.71 482.98 L 463.20 481.80 L 462.02 480.29 L 461.27 478.51 L 461.00 476.50 L 461.27 474.49 L 462.02 472.71 L 463.20 471.20 L 464.71 470.02 L 466.49 469.27 L 468.50 469.00 L 470.51 469.27 L 472.29 470.02 L 473.80 471.20 L 474.98 472.71 L 475.73 474.49 L 476.00 476.50 Z"
                                fill="#825852" fill-rule="evenodd" group-id="8" id="椭圆形备份" node-id="150" stroke="none"
                                target-height="15" target-width="15" target-x="461" target-y="469" />
                            <path
                                d="M 512.00 476.50 L 511.73 478.51 L 510.98 480.29 L 509.80 481.80 L 508.29 482.98 L 506.51 483.73 L 504.50 484.00 L 502.49 483.73 L 500.71 482.98 L 499.20 481.80 L 498.02 480.29 L 497.27 478.51 L 497.00 476.50 L 497.27 474.49 L 498.02 472.71 L 499.20 471.20 L 500.71 470.02 L 502.49 469.27 L 504.50 469.00 L 506.51 469.27 L 508.29 470.02 L 509.80 471.20 L 510.98 472.71 L 511.73 474.49 L 512.00 476.50 Z"
                                fill="#825852" fill-rule="evenodd" group-id="8" id="椭圆形备份-2" node-id="151" stroke="none"
                                target-height="15" target-width="15" target-x="497" target-y="469" />
                        </svg>
                        <p class="text-gray-600 text-sm dark:text-gray-400">未找到您想要的结果, 换个姿势再试试吧！！！</p>
                    </div>
                </div>
                <!-- Modal footer -->
                <div class="p-4 md:p-5 border-t text-xs flex items-center text-gray-400 dark:border-gray-600">
                    <!-- Esc 退出提示 -->
                    <span class="px-2 py-[1px] flex-none border rounded dark:border-gray-600">Esc</span>
                    <span class="text-gray-400 ml-2">关闭</span>

                    <!-- 底层技术介绍 -->
                    <span class="ml-auto">基于&nbsp;<a href="https://lucene.apache.org/" target="_blank"
                            class="underline">Apache Lucene</a>&nbsp;全文检索引擎开发</span>
                </div>
            </div>
        </div>
    </div>

    <!-- 知识库目录 drawer component -->
    <div id="wiki-catalog-drawer"
        class="block lg:hidden top-[4.3rem] fixed left-0 z-20 h-screen p-4 overflow-y-auto transition-transform -translate-x-full bg-white w-80 dark:bg-[#0d1117]"
        tabindex="-1" aria-labelledby="drawer-label">
        <!-- 知识库目录 -->
        <div class="grow transition-all duration-300">
            <div id="drawer-accordion-flush" data-accordion="collapse"
                data-active-classes="bg-white dark:bg-[#0d1117] dark:text-gray-300" data-inactive-classes=""
                class="last:pb-[170px]">
                <div v-for="(catalog, index) in props.catalogs" :key="index">
                    <h2 :id="'drawer-accordion-flush-heading-' + catalog.id">
                        <button type="button" class="hover:bg-gray-100 flex items-center justify-between w-full py-3 px-3 rounded-lg 
                            font-medium rtl:text-right text-gray-600 dark:text-gray-400 gap-3 dark:hover:bg-gray-800"
                            :data-accordion-target="'#drawer-accordion-flush-body-' + catalog.id"
                            :aria-expanded="[catalog.children.some(item => item.articleId == route.query.articleId) ? true : false]"
                            :aria-controls="'drawer-accordion-flush-body-' + catalog.id">
                            <!-- 一级目录标题 -->
                            <span class="flex items-center" v-html="catalog.title"></span>
                            <!-- 箭头 -->
                            <svg data-accordion-icon class="w-3 h-3 rotate-90 transition-all shrink-0" aria-hidden="true"
                                xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 6">
                                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                    d="M9 5 5 1 1 5" />
                            </svg>
                        </button>
                    </h2>
                    <!-- 二级目录 -->
                    <ul :id="'drawer-accordion-flush-body-' + catalog.id" class="hidden"
                        :aria-labelledby="'drawer-accordion-flush-heading-' + catalog.id">
                        <!-- 二级目录标题 -->
                        <li v-for="(childCatalog, index2) in catalog.children" :key="index2" class="flex items-center ps-10 py-2 pe-3 rounded-lg cursor-pointer 
                                    dark:text-gray-400"
                            :class="[childCatalog.articleId == route.query.articleId ? 'bg-sky-50 text-green-400 dark:bg-sky-950 dark:text-green-400' : 'hover:bg-gray-100 dark:hover:bg-gray-800']"
                            @click="goWikiArticleDetailPage(childCatalog.articleId)" v-html="childCatalog.title">
                        </li>
                    </ul>
                </div>
            </div>
        </div>

    </div>
</template>

<script setup>
import { onMounted, ref, onBeforeUnmount, watch } from 'vue'
import { initCollapses, initDropdowns, initModals, initAccordions, Modal, Drawer } from 'flowbite'
import { useBlogSettingsStore } from '@/stores/blogsettings'
import { useUserStore } from '@/stores/user'
import { useRouter, useRoute } from 'vue-router'
import { showMessage } from '@/composables/util'
import { getArticleSearchPageList } from '@/api/frontend/search'
import { useDark, useToggle } from '@vueuse/core'

// 对外暴露属性，将目录数据传进来
const props = defineProps({
    catalogs: {
        type: Array,
        default: []
    }
})

const modalOptions = {
    placement: 'top-center', // 弹框位置
    backdrop: 'dynamic',
    backdropClasses:
        'bg-gray-900/50 dark:bg-gray-900/80 fixed inset-0 z-40',
    closable: true,
    onHide: () => {
    },
    onShow: () => {
    },
    onToggle: () => {
    },
};

// instance options object
const instanceOptions = {
    id: 'searchModalEl',
    override: true
};

// options with default values
const drawerOptions = {
    placement: 'left',
    backdrop: true,
    bodyScrolling: false,
    edge: false,
    edgeOffset: '',
    backdropClasses:
        'bg-gray-900/50 dark:bg-gray-900/80 fixed inset-0 z-[19] block lg:hidden',
    onHide: () => {
        isDrawerExpand.value = false
    },
    onShow: () => {
    },
    onToggle: () => {
    },
};

// instance options object
const instanceOptionsDrawer = {
    id: 'wiki-catalog-drawer',
    override: true
};

// 知识库目录 Drawer 引用
const wikiDrawer = ref(null)
// 初始化 flowbit 相关组件
const searchModal = ref(null)

// 初始化 flowbit 相关组件
onMounted(() => {
    initCollapses();
    initDropdowns();
    initModals();
    initAccordions();

    // 初始化
    const $modalElement = document.querySelector('#search-modal');
    searchModal.value = new Modal($modalElement, modalOptions, instanceOptions);

    // 初始化知识库目录 Drawer
    const $drawerElement = document.getElementById('wiki-catalog-drawer');
    wikiDrawer.value = new Drawer($drawerElement, drawerOptions, instanceOptionsDrawer);

    // 注册键盘事件监听器
    window.addEventListener('keydown', handleKeyDown);
})

onBeforeUnmount(() => {
    // 在组件销毁前移除事件监听器，防止内存泄漏
    window.removeEventListener('keydown', handleKeyDown);
})

// 搜索输入框引用
const searchInputRef = ref(null)
// 键盘监听
const handleKeyDown = (event) => {
    // 检查是否按下了 Ctrl 键和 K 键
    if (event.ctrlKey && event.key === 'k') {
        // 阻止激活浏览器本身的搜索框
        event.preventDefault()

        searchModal.value.show()

        // 激活搜索框
        searchInputRef.value.focus()
    }
}

const router = useRouter()
const route = useRoute()

// 当前路由地址
const currPath = ref(route.path)

// 引入博客设置信息 store
const blogSettingsStore = useBlogSettingsStore()

// 是否登录，通过 userStore 中的 userInfo 对象是否有数据来判断
const userStore = useUserStore()
// 获取 userInfo 对象所有属性名称的数组
const keys = Object.keys(userStore.userInfo)
// 若大于零，则表示用户已登录
const isLogined = ref(keys.length > 0)

// 退出登录
const logout = () => {
    userStore.logout()
    // 标记为未登录
    isLogined.value = false
    showMessage('退出登录成功')
}

// 点击搜索框
const clickSearchBtn = () => {
    searchModal.value.show()
    // 激活搜索框
    searchInputRef.value.focus()
}

// 文章搜索结果
const searchArticles = ref([])
// 当前页码，给了一个默认值 1
const current = ref(1)
// 总数据量，给了个默认值 0
const total = ref(0)
// 每页显示的数据量，给了个默认值 10
const size = ref(1)
// 总共多少页
const pages = ref(0)
// 搜索关键词
const searchWord = ref('')

// 搜索 Loading
const searchLoading = ref(false)

watch(searchWord, (newText, oldText) => {
    if (newText && newText !== oldText) { // 若搜索关键词不为空，且和之前的值不相同
        renderSearchArticles({ current: current.value, size: size.value, word: newText })
    } else if (newText == '') { // 搜索词为空
        // 置空
        searchArticles.value = []
    }
})

// 请求后台检索接口
function renderSearchArticles(data) {
    // 显示加载 Loading
    searchLoading.value = true
    getArticleSearchPageList(data).then(res => {
        if (res.success) {
            searchArticles.value = res.data
            current.value = res.current
            size.value = res.size
            total.value = res.total
            pages.value = res.pages
        }
    }).finally(() => searchLoading.value = false) // 隐藏加载 Loading
}

// 渲染下一页搜索结果
const nextPage = () => {
    renderSearchArticles({ current: current.value + 1, size: size.value, word: searchWord.value })
}

// 渲染上一页搜索结果
const prePage = () => {
    renderSearchArticles({ current: current.value - 1, size: size.value, word: searchWord.value })
}

// 点击搜索结果，跳转文章详情页
const jumpToArticleDetailPage = (articleId) => {
    // 隐藏搜索对话框
    searchModal.value.hide()
    // 路由跳转
    router.push('/article/' + articleId)
}

const isDark = useDark()
const toggleDark = useToggle(isDark)

// 知识库目录抽屉是否展开，默认未展开
const isDrawerExpand = ref(false)
// 侦听 isDrawerExpand 变量
watch(isDrawerExpand, (newText, oldText) => {
    if (newText) {
        // 展示抽屉
        wikiDrawer.value.show()
    } else {
        // 隐藏抽屉
        wikiDrawer.value.hide()
    }
})

// 跳转文章详情页
const goWikiArticleDetailPage = (articleId) => {
    isDrawerExpand.value = false
    router.push({path: '/wiki/' + route.params.wikiId, query: {articleId}})
}
</script>

<style scoped>
.vt-switch {
    --vt-c-divider-light-1: rgba(60, 60, 60, .29);
    --vt-c-divider: var(--vt-c-divider-light-1);
    --vt-c-white-mute: #f1f1f1;
    --vt-c-bg-mute: var(--vt-c-white-mute);
    position: relative;
    border-radius: 11px;
    display: block;
    width: 40px;
    height: 22px;
    flex-shrink: 0;
    border: 1px solid var(--vt-c-divider);
    background-color: var(--vt-c-bg-mute);
    transition: border-color .25s, background-color .25s;
}

.dark .vt-switch {
    --vt-c-white-mute: #f1f1f1;
    background-color: #2f2f2f;
    transition: border-color .25s, background-color .25s;
}

.vt-switch-check {
    --vt-c-white: #ffffff;
    --vt-shadow-1: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06);
    position: absolute;
    top: 1px;
    left: 1px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: var(--vt-c-white);
    box-shadow: var(--vt-shadow-1);
    transition: background-color .25s, transform .25s;
}

.dark .vt-switch-appearance .vt-switch-check {
    transform: translate(18px);
}

.dark .vt-switch-check {
    --vt-c-black: #1a1a1a;
    background-color: var(--vt-c-black);
}

.vt-switch-icon {
    position: relative;
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    overflow: hidden;
}

.vt-switch-icon svg {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    fill: rgba(60, 60, 60, .7);
}

.dark .vt-switch-icon svg {
    fill: rgba(255, 255, 255, .87);
    transition: opacity .25s;
}

.dark .vt-switch-appearance-moon {
    opacity: 1;
}

.vt-switch-appearance-sun {
    opacity: 1;
}

#checkbox {
    display: none;
}

.toggle {
    position: relative;
    width: 23px;
    height: 23px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    transition-duration: .5s;
}

.bars {
    width: 100%;
    height: 2.5px;
    background-color: rgb(107 114 128 / 1);
    border-radius: 2.5px;
}

#bar2 {
    transition-duration: .8s;
}

#bar1,
#bar3 {
    width: 70%;
}

#checkbox:checked+.toggle .bars {
    position: absolute;
    transition-duration: .5s;
}

#checkbox:checked+.toggle #bar2 {
    transform: scaleX(0);
    transition-duration: .5s;
}

#checkbox:checked+.toggle #bar1 {
    width: 100%;
    transform: rotate(45deg);
    transition-duration: .5s;
}

#checkbox:checked+.toggle #bar3 {
    width: 100%;
    transform: rotate(-45deg);
    transition-duration: .5s;
}

#checkbox:checked+.toggle {
    transition-duration: .5s;
    transform: rotate(180deg);
}
</style>

